<template>
  <div class="mainBasicInfo">


    <lockELFinger :basicInfoData="itemData"></lockELFinger>
    <LockELFace :basicInfoData="itemData"></LockELFace>
    <LockELNetMethod :basicInfoData="itemData"></LockELNetMethod>
    <LockELTouch :basicInfoData="itemData"></LockELTouch>
    <LockELVedio :basicInfoData="itemData"></LockELVedio>


  </div>
</template>
<script>
import LockELFinger from './conponents/lockELFinger.vue';
import LockELFace from './conponents/lockELFace.vue';
import LockELNetMethod from './conponents/lockELNetMethod.vue';
import LockELTouch from './conponents/lockELTouch.vue';
import LockELVedio from './conponents/lockELVedio.vue';
import videoPlay from "./conponents/videoPlay";

export default {
  props: {
    basicInfoData: {
      type: Object,
      default() {
        return {};
      }
    }
  },
  components: {
    videoPlay,
    LockELFace,
    LockELNetMethod,
    LockELVedio,
    LockELFinger,
    LockELTouch


  },
  data() {
    return {
      formInline: {},
      isShow: false,
      videoUrl: "",
      reFresh: true,

      listData: [],
      lock_brand: [],
      openlock_type: [],
      net_app: [],
      mark_time: [],
      place: [],
      made_enterprise: [],
      insert_core_type: [],
      clutch_type: [],
      main_material: [],
      auto_type: [],
      common_y_or_n: [],
      total: 0,
      arr: [],
       cate: [
        { name: "品牌", code: "lock_brand" },
        { name: "开锁方式", code: "openlock_type" },
        { name: "联网APP", code: "net_app" },
        { name: "上市时间", code: "mark_time" },
        { name: "产地", code: "place" },
        { name: "生产企业", code: "made_enterprise" },
        { name: "插芯方式", code: "insert_core_type" },
        { name: "离合方式", code: "clutch_type" },
        { name: "主要材质", code: "main_material" }
      ],
      itemData:{}
    };
  },
  watch: {

  },
  mounted() {
     this.itemData = this.basicInfoData
     console.log(this.itemData)
  },
  computed: {


  },
  methods: {

  }
};
</script>
<style scoped>
.mainBasicInfo {
  width: 100%;
  height: 100%;
}
.title {
  height: 46px;
  line-height: 46px;
  font-size: 16px;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #263c92;
  border-bottom: 1px solid #b1b7ca;
  width: 100%;
}
.brand-info {
  margin: 35px 0;
  border-bottom: 1px solid #b1b7ca;
}
.el-form-item {
  width:35%;
  margin: 0;
}
/deep/.el-form-item__label {
  width: 120px;
  color: #888888;
}
.type-info .el-form-item {
  margin-right: 130px;
}
.img-info .el-form-item {
  margin-right: 0;
}
.img-info /deep/.el-form-item__label {
  width: 130px;
}
.img-box img:last-child {
  margin-right: 0;
}
.img-box .el-image {
  width: 205px;
  height: 186px;
  margin-right: 32px;
  background-color: #e1e2e8;
}
.video-info {
  border-bottom: none;
}
.video-img {
  width: 205px;
  height: 186px;
}
</style>
